<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
  <head>
    <title>Product</title>
    <script src="script/jquery.1.7.js"></script>

  </head>
  
  <body>
 		
 		<table class="table">
					<thead>
						<tr>
							<th>商品编号</th>
							<th>商品名称</th>
							<th>商品价格</th>
							<th>是否上架</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>

					</tbody>
		</table>
		<br>
		<br>
		<h3>添加商品</h3>
		商品编号:<input type="text" class="input1" />
		<br>
 		商品名称:<input type="text" class="input1" />
		<br>
		商品价格:<input type="text" class="input1" />
		<br>
		是否上架：<input class="input1" name="radio"
				 	type="radio" value="true" checked="checked">是
				 	 <input id="input01" class="input1" name="radio" type="radio" value="false">否
		<br/>		
		<input type="button" value="添加" id="add"/>			
		
		
		<script type="text/javascript">
			$(document).ready(function(){
				$.get("product.jspx",function(data){
					show(data);
				});
			});
			

			$("#add").click(function() {
				var flag = true;
				$("input[type='text']").each(function() {
					if ($(this).val() == "") {
						flag = false;
						return false;
					}
				});

				if (flag) {
					$.post("product.jspx", {
						"task" : "insert",
						"id" : $(".input1:eq(0)").val(),
						"name" : $(".input1:eq(1)").val(),
						"price" : $(".input1:eq(2)").val(),
						"enable" : $(".input1:checked").val()
					}, function(data) {
						show(data);
					});
				}
				show(data);
			});
			
			
			$(".del").live("click", function() {
				$.post("product.jspx", {
					"task" : "del",
					"id" : $(this).attr("rel")
				}, function(data) {
					show(data);
				});
			});
			
			
			function show(data) {
				$("tbody tr").empty();
					$(data).each(
							function() {
								$(
									"<tr><td class = 'id'>"
									+ this.prodid
									+ "</td><td class = 'name'>"
									+ this.name
									+ "</td><td class = 'price'>"
									+ this.price
									+ "</td><td class = 'enable'>"
									+ enable(this.enable)
									+ "</td><td><a class = 'del' href = 'javascript:void(0)' rel = "
									+ this.id + ">删除</a></td></tr>")
							.appendTo($("tbody"));
							});
		}

		function enable(enable) {
			if (enable) {
				return "是";
			} else {
				return "否";
			}
		}

		function toboolean(enable) {
			if (enable == "是") {
				return true;
			} else if (enable == "否") {
				return false;
			}
		}

		</script>
  </body>
</html>
